<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./iconfont/iconfont.css">
    <link rel="stylesheet"  href="./css/swiper-bundle.min.css">
    <style>
        .Big{width: 1519px;height: 2713px;}
        .head{width: 1519px;height: 30px;background-color: rgb(252, 238, 245);}
        .head li{float: left;font-size: 12px;height: 30px;text-align: center;line-height: 30px;margin-left: 20px;}
        .head li a {color: black;}
        .head li a:hover{color: blue;}
        .head li:nth-child(1){margin-left: 150px;}.head li:nth-child(3){margin-left: 750px;}
        .logo{width: 1519px;height: 140px;background-color: rgb(253, 253, 253);position: relative;}
        .logo span{position: absolute;top: 56px;right: 198px;font-size: 13px;color: purple;}
        .logo img:nth-child(1){margin-left: 150px;float: left;margin-top: 10px;}
        .logo img:nth-child(2){float: right;margin-top: 45px;margin-right: 160px;}
        .main{width: 600px;height: 90px;float: left;margin-top: 50px;}
        .main a{color: brown;}
        .main li{float: left;margin-left: 10px;font-size: 12px;}
        .main li:nth-child(1){margin-left: 90px;}
        .main button{height: 34px;width: 60px;background-color: palevioletred;outline: none;border: 2px solid palevioletred;}
        .main input{width: 400px;height: 30px;border: 2px solid palevioletred;margin-left: 90px;outline: none;text-indent: 1em;}
        .iconfont{color: rgb(221, 69, 120);font-size: 16px;}
        .nav li{float: left;margin-left: 30px;}
        .nav li:hover{background-color: palevioletred;border-radius: 5px;}
        .nav li a{color: black;font-size: 17px;font-weight: bold;}
        .nav li:nth-child(1){margin-left: 400px;}
        .swiper {width: 1519px;height: 380px;position: relative;background-color: black;position: relative;}
        .swiper-slide {text-align: center; font-size: 18px;background: rgb(250, 215, 215);display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}
        .swiper-slide img {display: block;width: 919px;height: 380px;object-fit: cover;}
        .left{width: 220px;height: 380px;z-index: 999;position: absolute;top: 193px;left: 80px;background-color: white;}
        .left li:hover{color: rgb(164, 164, 250);}

        .nav1{width: 400px;height: 350px;border: 1px red solid;background-color: white;position: absolute;top: 193px;left: 300px;z-index: 999;float: left;display: none;}
        .nav1 li:nth-child(1){font-size: 20px;margin-left: 5px;}
        .nav1 li:nth-child(7){font-size: 20px;margin-left: 5px;}
        .nav1 span{color: plum;font-weight: bold;margin-left: 60px;margin-right: 20px;}
        .nav1 li{margin-bottom: 10px;font-size: 13px;}

        .nav2{width: 400px;height: 350px;border: 1px red solid;background-color: white;position: absolute;top: 193px;left: 300px;z-index: 999;float: left;display: none;}
        .nav2 li:nth-child(1){font-size: 20px;margin-left: 5px;}
        .nav2 li:nth-child(7){font-size: 20px;margin-left: 5px;}
        .nav2 span{color: plum;font-weight: bold;margin-left: 60px;margin-right: 20px;}
        .nav2 li{margin-bottom: 10px;font-size: 13px;}

        .nav3{width: 400px;height: 350px;border: 1px red solid;background-color: white;position: absolute;top: 193px;left: 300px;z-index: 999;float: left;display: none;}
        .nav3 li:nth-child(1){font-size: 20px;margin-left: 5px;}
        .nav3 li:nth-child(7){font-size: 20px;margin-left: 5px;}
        .nav3 span{color: plum;font-weight: bold;margin-left: 60px;margin-right: 20px;}
        .nav3 li{margin-bottom: 10px;font-size: 13px;}

        .nav4{width: 400px;height: 350px;border: 1px red solid;background-color: white;position: absolute;top: 193px;left: 300px;z-index: 999;float: left;display: none;}
        .nav4 li:nth-child(1){font-size: 20px;margin-left: 5px;}
        .nav4 li:nth-child(7){font-size: 20px;margin-left: 5px;}
        .nav4 span{color: plum;font-weight: bold;margin-left: 60px;margin-right: 20px;}
        .nav4 li{margin-bottom: 10px;font-size: 13px;}

        .nav5{width: 400px;height: 350px;border: 1px red solid;background-color: white;position: absolute;top: 193px;left: 300px;z-index: 999;float: left;display: none;}
        .nav5 li:nth-child(1){font-size: 20px;margin-left: 5px;}
        .nav5 li:nth-child(7){font-size: 20px;margin-left: 5px;}
        .nav5 span{color: plum;font-weight: bold;margin-left: 60px;margin-right: 20px;}
        .nav5 li{margin-bottom: 10px;font-size: 13px;}

        .right{width: 200px;height: 379.5px;z-index: 999;position: absolute;top: 193px;right: 140px;background-color: white;}
        .left li{width: 200px;height: 73px;text-align: center;line-height: 73px;border-bottom: 1px dashed rgb(226, 226, 226);}
        .right li {width: 180px;height: 126.3px;border-bottom: 1px dashed rgb(226, 226, 226);overflow: hidden;}
        .right li img{transform: scale(1.0);transition-duration: 0.8s;}
        .right li:hover img{transform: translateX(-15px);}
        .wenzi1{width: 1519px;height: 50px;}
        .wenzi1 p{font-size: 20px;margin-left: 180px;}.wenzi1 a{color: black;line-height: 50px;}
        .list{width: 1519px;height: 477px;background-color: rgb(255, 255, 255);}
        .leftList{position: relative;}
        .litle{width: 330px;height: 170px;background-color: rgba(240, 255, 255, 0.253);position: absolute;top: 306px;left: 180px;}
        .leftList img{margin-left: 180px;float: left;}
        .leftList p{position: absolute;top: 10px;left: 10px;z-index: 999;}
        .leftList a{color: rgb(46, 45, 45);}
        .litle ul{margin-top: 50px;}
        .litle li{float: left;height: 25px;background-color: white;border-radius: 15px;text-align: center;line-height:25px;width: 80px;margin-left: 20px;margin-top: 10px;font-size: 13px;color: rgb(92, 91, 91);}
        .litle li:hover{color: rgb(164, 164, 250);}
        .rightList li{float: left;width: 217px;height: 236px;background-color: rgb(255, 255, 255);border: 0.5px rgba(206, 206, 206, 0.521) solid;overflow: hidden;}
        .rightList img{margin-left: 32px;width: 160px;height: 160px;transform: scale(1.0);transition-duration: 0.8s;}
        .rightList li:hover img{transform: translateY(-8px);}
        .rightList p{margin-left: 20px;color: rgb(122, 122, 122);font-size: 14px;}
        .rightList span{margin-left: 20px;color: brown;font-size: 20px;}
        .tubiao{width: 1519px;height: 83px;margin-top: 10px;}
        .tubiao li{width: 149px;height: 60px;float: left;border: 0.1px rgba(43, 42, 42, 0.301) dashed;overflow: hidden;}
        .tubiao img{margin-left: 25px;margin-top: 5px;transform: scale(1.0);transition-duration: 0.8s;}
        .tubiao li:hover img {transform: scale(1.2);}
        .tubiao li:nth-child(1){margin-left: 180px;}
        .last{width: 1519px;height: 290px;background-color: rgb(226, 224, 224);}
        .two{width: 1519px;height: 50px;}
        .three{width: 1519px;height: 50px;}
        .four{width: 1519px;height: 50px;}
        .one a{margin-left: 80px;color: black;font-size: 18px;line-height: 80px;font-weight: bold;}
        .one ul{border-bottom: 1px rgba(5, 5, 5, 0.096) solid;height: 120px;width: 1519px;}
        .one li{width: 170px;height: 80px;background-color: rgb(226, 224, 224);overflow: hidden;float: left;margin-right: 30px;margin-top: 20px;transition-duration: 0.8s;}
        .one li:hover{transform: translateY(-15px);}
        .one li:hover a{color: brown;}
        .one li:nth-child(1){background-image: url(./img/logo.png);background-position: 10px 10px;background-repeat: no-repeat;margin-left: 180px;}
        .one li:nth-child(2){background-image: url(./img/logo.png);background-position: 10px -70px;background-repeat: no-repeat;}
        .one li:nth-child(3){background-image: url(./img/logo.png);background-position: 10px -150px;background-repeat: no-repeat;}
        .one li:nth-child(4){background-image: url(./img/logo.png);background-position: 10px -231px;background-repeat: no-repeat;}
        .one li:nth-child(5){background-image: url(./img/logo.png);background-position: 10px -310px;background-repeat: no-repeat;}
        .one li:nth-child(6){background-image: url(./img/logo.png);background-position: 10px -390px;background-repeat: no-repeat;}
        .two li{float: left;margin-left: 30px;overflow: hidden;}
        .two li:nth-child(1){margin-left: 320px;}
        .two a{color: rgb(138, 136, 136);font-size: 12px;line-height: 50px;}
        .two li:hover a{color: brown;text-decoration: underline;}
        .four li{float: left;margin-left: 30px;}
        .four li:nth-child(1){margin-left: 190px;}
        .four a{color: rgb(27, 27, 27);font-size: 13.5px;line-height: 50px;}
        .four li:hover a{color: brown;text-decoration: underline;}
        .three li{float: left;margin-left: 20px;}
        .three li:nth-child(1){margin-left: 420px;}
        .three a{line-height: 50px;}
        #yi{width:100px;height: 40px;text-align: center;line-height: 10px;background-color: rgb(53, 52, 53);position: fixed;top: 500px;right: 10px;font-size: 16px;color: white;display: none;} 
        #yi:hover{color: red;}
        .five img{width: 1519px;height: 170px;}
    </style>
</head>
<body>
    <div class="Big">
        <button id="yi">回到顶部↑</button>
        <div class="head">
           <ul>
               <li class="iconfont icon-shouye"><a href="">E宠首页</a></li>
               <li class="iconfont icon-yugutou"><a href="">E宠就是正品</a></li>
               <li><a href="file:///C:/Users/LENOVO/Desktop/e-pet-website/login.html">[登录]</a></li>
               <li><a href="file:///C:/Users/LENOVO/Desktop/e-pet-website/item.html">[注册]</a></li>
               <li class="iconfont icon-gouwucheman"><a href="file:///C:/Users/LENOVO/Desktop/e-pet-website/cart.html">购物车</a></li>
               <li class="iconfont icon-yonghu"><a href="">我的E宠</a></li>
               <li class="iconfont icon-shoucang"><a href="">收藏</a></li>
               <li class="iconfont icon-shouji"><a href="">手机版</a></li>
               <li ><a href="" style="color: brown;">问题反馈</a></li>
           </ul>
        </div>
        <div class="logo">
            <img src="./img/cat-logo.png" alt="">
            <img src="./img/shopping-cart1.gif" alt=""><span>购物车</span>
            <div class="main">
                <p><input type="text" placeholder="猫咪猫砂"><button>搜索</button></p>
            <ul>
                <li><a href="" style="color: rgb(109, 107, 107);">热门搜索:</a></li>
                <li><a href="">超值多包猫砂</a></li> 
                <li><a href="">洁客好物</a></li>
                <li><a href="">周期配送</a></li>
                <li><a href="">领渴望150元大额券</a></li>
                <li><a href="">希宝</a></li> 

            </ul>
            </div>
            
        </div>
        <div class="nav">
            <ul>
                <li class="iconfont icon-yugutou"><a href="">品牌特卖</a></li>
                <li class="iconfont icon-yugutou"><a href="">潮品视频</a></li>
                <li class="iconfont icon-yugutou"><a href="">小剧场</a></li>
                <li class="iconfont icon-yugutou"><a href="">E宠课堂</a></li>
                <li class="iconfont icon-yugutou"><a href="">萌爪联盟</a></li>
                <li class="iconfont icon-yugutou"><a href="">清仓特价</a></li>
            </ul>
        </div>
        <div class="swiper mySwiper">
            <div class="swiper-wrapper">
              <div class="swiper-slide"><img src="./img/banner2.jpg" alt=""></div>
              <div class="swiper-slide"><img src="./img/banner3.jpg" alt=""></div>
              <div class="swiper-slide"><img src="./img/banner1.jpg" alt=""></div>
              <div class="swiper-slide"><img src="./img/banner4.jpg" alt=""></div>
              <div class="swiper-slide"><img src="./img/banner5.jpg" alt=""></div>
            </div>
            <div class="swiper-button-next"></div>
            <div class="swiper-button-prev"></div>
            <div class="swiper-pagination"></div>
          </div>
          <div class="left">
                <ul>
                    <li>主粮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;零食</li>
                    <li>清洁&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;生活</li>
                    <li>保健&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;护理</li>
                    <li>玩具&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;洗浴</li>
                    <li>装扮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;出行</li>
                </ul> 
                
            </div>
            <div class="nav1">
                    <ul>
                        <li class="iconfont icon-maoliang">猫粮主食</li>
                        <li><span>进口猫粮</span>|老年猫|幼猫|成猫|全猫|冻干粮</li>
                        <li><span>国产猫粮</span>|奶猫|奶糕粮|成猫|全猫|冻干粮</li>
                        <li><span>冻干猫粮</span></li>
                        <li><span>功能猫粮</span>|肠胃|泌尿|肥胖|毛球</li>
                        <li><span>主食罐头</span>|新西兰罐|德冠|其他</li>
                        <li class="iconfont icon-maoliang">猫咪零食</li>
                        <li><span>进口猫粮</span>|老年猫|幼猫|成猫|全猫|冻干粮</li>
                        <li><span>国产猫粮</span>|奶猫|奶糕粮|成猫|全猫|冻干粮</li>
                        <li><span>冻干猫粮</span></li>
                        <li><span>功能猫粮</span>|肠胃|泌尿|肥胖|毛球</li>
                        <li><span>主食罐头</span>|新西兰罐|德冠|其他</li>
                     </ul>
                </div>
                <div class="nav2">
                    <ul>
                        <li class="iconfont icon-yugutou" style="color: purple;">猫粮清洁</li>
                        <li><span>猫咪猫砂</span>|老年猫|幼猫|成猫|全猫|冻干粮</li>
                        <li><span>猫咪厕所</span>|奶猫|奶糕粮|成猫|全猫|冻干粮</li>
                        <li><span>清洁除臭</span>|免洗手凝露|尿片|湿巾</li>
                        <li><span>猫咪厕所</span>|奶猫|奶糕粮|成猫|全猫|冻干粮</li>
                        <li><span>清洁除臭</span>|免洗手凝露|尿片|湿巾</li>
                        <li class="iconfont icon-yugutou" style="color: purple;">猫咪日用</li>
                        <li><span>进口猫粮</span>|老年猫|幼猫|成猫|全猫|冻干粮</li>
                        <li><span>国产猫粮</span>|奶猫|奶糕粮|成猫|全猫|冻干粮</li>
                        <li><span>冻干猫粮</span></li>
                     </ul>
                </div>
                <div class="nav3">
                    <ul>
                        <li class="iconfont icon-maoliang">猫粮主食</li>
                        <li><span>进口猫粮</span>|老年猫|幼猫|成猫|全猫|冻干粮</li>
                        <li><span>国产猫粮</span>|奶猫|奶糕粮|成猫|全猫|冻干粮</li>
                        <li><span>冻干猫粮</span></li>
                        <li><span>功能猫粮</span>|肠胃|泌尿|肥胖|毛球</li>
                        <li><span>主食罐头</span>|新西兰罐|德冠|其他</li>
                        <li class="iconfont icon-maoliang">猫咪零食</li>
                        <li><span>进口猫粮</span>|老年猫|幼猫|成猫|全猫|冻干粮</li>
                     </ul>
                </div>
                <div class="nav4">
                    <ul>
                        <li class="iconfont icon-yugutou" style="color: purple;">猫粮主食</li>
                        <li><span>进口猫粮</span>|老年猫|幼猫|成猫|全猫|冻干粮</li>
                        <li><span>国产猫粮</span>|奶猫|奶糕粮|成猫|全猫|冻干粮</li>
                        <li><span>冻干猫粮</span></li>
                        <li><span>功能猫粮</span>|肠胃|泌尿|肥胖|毛球</li>
                        <li><span>主食罐头</span>|新西兰罐|德冠|其他</li>
                        <li class="iconfont icon-yugutou" style="color: purple;">猫咪零食</li>
                        <li><span>进口猫粮</span>|老年猫|幼猫|成猫|全猫|冻干粮</li>
                        <li><span>功能猫粮</span>|肠胃|泌尿|肥胖|毛球</li>
                        <li><span>主食罐头</span>|新西兰罐|德冠|其他</li>
                     </ul>
                </div>
                <div class="nav5">
                    <ul>
                        <li class="iconfont icon-maoliang">猫粮主食</li>
                        <li><span>进口猫粮</span>|老年猫|幼猫|成猫|全猫|冻干粮</li>
                        <li><span>国产猫粮</span>|奶猫|奶糕粮|成猫|全猫|冻干粮</li>
                        <li><span>冻干猫粮</span></li>
                        <li><span>功能猫粮</span>|肠胃|泌尿|肥胖|毛球</li>
                        <li><span>主食罐头</span>|新西兰罐|德冠|其他</li>
                        <li class="iconfont icon-maoliang">猫咪零食</li>
                        <li><span>进口猫粮</span>|老年猫|幼猫|成猫|全猫|冻干粮</li>
                        <li><span>功能猫粮</span>|肠胃|泌尿|肥胖|毛球</li>
                        <li><span>主食罐头</span>|新西兰罐|德冠|其他</li>
                     </ul>
                </div>
           
            <div class="right">
                <ul>
                    <li><img src="./img/tupian1.jpg" alt=""></li>
                    <li><img src="./img/tupian2.jpg" alt=""></li>
                    <li><img src="./img/tupian3.jpg" alt=""></li>
                </ul>
            </div>
            <div class="wenzi1">
              <p class="iconfont icon-maoliang"><a href="">猫咪主粮</a></p>
            </div>
            <div class="list">
               <div class="leftList">
                    <img src="./img/1.jpg" alt="">
                   <div class="litle">
                    <p class="iconfont icon-remen"><a href="">最热HOT</a></p>
                    <ul>
                        <li>品质猫粮</li>
                        <li>性价比猫粮</li>
                        <li>海洋之星</li>
                        <li>牛油果</li>
                        <li>冠能猫粮</li>
                        <li>天然蓝氏</li>
                        <li>人气狗粮</li>
                        <li>雷米高</li>
                        <li>皇室</li>
                    </ul>
                   </div>
               </div>
               <div class="rightList">
                    <ul id="shop">
                      
                    </ul>
               </div>
            </div>
            <div class="tubiao">
                 <ul>
                     <li><a href=""><img src="./img/11.jpg" alt=""></a></li>
                     <li><a href=""><img src="./img/22.jpg" alt=""></a></li>
                     <li><a href=""><img src="./img/33.jpg" alt=""></a></li>
                     <li><a href=""><img src="./img/44.jpg" alt=""></a></li>
                     <li><a href=""><img src="./img/55.jpg" alt=""></a></li>
                     <li><a href=""><img src="./img/66.jpg" alt=""></a></li>
                     <li><a href=""><img src="./img/77.jpg" alt=""></a></li>
                     <li><a href=""><img src="./img/88.jpg" alt=""></a></li>
                 </ul>
            </div>
            <div class="wenzi1">
                <p class="iconfont icon-yugutou"><a href="">猫咪零食</a></p>
              </div>
              <div class="list">
                 <div class="leftList">
                      <img src="./img/2.jpg" alt="">
                     <div class="litle">
                      <p class="iconfont icon-remen"><a href="">最热HOT</a></p>
                      <ul>
                          <li>希宝</li>
                          <li>梦吉猫罐</li>
                          <li>爱普士猫罐</li>
                          <li>爱丽丝猫罐</li>
                          <li>King Kitty</li>
                          <li>紐萃宝猫罐</li>
                          <li>卡比猫罐</li>
                          <li>K9Natural</li>
                          <li>柏可心鱼干</li>
                      </ul>
                     </div>
                 </div>
                 <div class="rightList">
                      <ul id="shop2">
                          <li><a href="">
                              <img src="./img/01.jpg" alt="">
                              <p>路斯 猫用小鱼饼干 金枪鱼+猫薄荷</p>
                              <span>￥9.90</span>
                          </a></li>
                          <li><a href="">
                              <img src="./img/02.jpg" alt="">
                              <p>泰国原装进口希宝sheba 金枪鱼拼香焙鸡肉味夹心酥成猫零食</p>
                              <span>￥42.00</span>
                          </a></li>
                          <li><a href="">
                              <img src="./img/03.jpg" alt="">
                              <p>Freshcat 海鲜大咖系列 鲔鱼+扇贝配方夹心酥猫零食</p>
                              <span>￥16.00</span>
                          </a></li>
                          <li><a href="">
                              <img src="./img/04.jpg" alt="">
                              <p>繁育者的秘密 happy time系列 犬猫通用深海鳕鱼味羊奶饮品</p>
                              <span>￥16.80</span>
                          </a></li>
                          <li><a href="">
                              <img src="./img/05.jpg" alt="">
                              <p>日本品牌伊纳宝 啵吉系列 金枪鱼+三文鱼猫零食</p>
                              <span>￥11.80</span>
                          </a></li>
                          <li><a href="">
                              <img src="./img/06.jpg" alt="">
                              <p>BOTH 成猫山羊奶布丁 单粒成猫山羊奶布丁</p>
                              <span>￥1.60</span>
                          </a></li> 
                          <li><a href="">
                            <img src="./img/07.jpg" alt="">
                            <p>Amycarol 天然猫草(猫薄荷）ycarol 天然猫草</p>
                            <span>￥15.00</span>
                        </a></li>
                        <li><a href="">
                            <img src="./img/08.jpg" alt="">
                            <p>魔金Magic 种植健康猫草Magic 种植健康</p>
                            <span>￥12.00</span>
                        </a></li>
                      </ul>
                 </div>
              </div>
              <div class="tubiao">
                <ul>
                    <li><a href=""><img src="./img/111.jpg" alt=""></a></li>
                    <li><a href=""><img src="./img/222.jpg" alt=""></a></li>
                    <li><a href=""><img src="./img/333.png" alt=""></a></li>
                    <li><a href=""><img src="./img/444.jpg" alt=""></a></li>
                    <li><a href=""><img src="./img/555.png" alt=""></a></li>
                    <li><a href=""><img src="./img/666.png" alt=""></a></li>
                    <li><a href=""><img src="./img/777.jpg" alt=""></a></li>
                    <li><a href=""><img src="./img/888.jpg" alt=""></a></li>
                </ul>
           </div>
           <div class="wenzi1">
            <p class="iconfont icon-yugutou"><a href="">猫咪日用</a></p>
          </div>
          <div class="list">
             <div class="leftList">
                  <img src="./img/3.jpg" alt="">
                 <div class="litle">
                  <p class="iconfont icon-remen"><a href="">最热HOT</a></p>
                  <ul>
                      <li>俏尾巴</li>
                      <li>植物猫砂</li>
                      <li>猫砂礼包</li>
                      <li>梵米派</li>
                      <li>酵素猫砂</li>
                      <li>口腔保健碗</li>
                      <li>埃尔西博士</li>
                      <li>湿巾</li>
                      <li>清洁好帮手</li>
                  </ul>
                 </div>
             </div>
             <div class="rightList">
                  <ul id="shop3">
                       <li><a href="">
                          <img src="./img/001.jpg" alt="">
                          <p>美国贝适安Petsafe旗下ScoopFree 自洁式猫砂盆</p>
                          <span>￥2499.00</span>
                      </a></li>
                      <li><a href="">
                          <img src="./img/002.jpg" alt="">
                          <p>日本进口爱丽思IRIS 蜗居式猫砂盆 白色 </p>
                          <span>￥129.00</span>
                      </a></li>
                      <li><a href="">
                          <img src="./img/003.jpg" alt="">
                          <p>爱丽思IRIS 半封闭猫砂盆 NA-400N 粉色</p>
                          <span>￥118.00</span>
                      </a></li>
                      <li><a href="">
                          <img src="./img/004.jpg" alt="">
                          <p>爱丽思IRIS 封闭式双层猫厕所 TIO-530FT 橙色</p>
                          <span>￥198.00</span>
                      </a></li>
                      <li><a href="">
                          <img src="./img/005.jpg" alt="">
                          <p>爱丽思IRIS 厚型猫用湿巾 80片厚型猫用湿巾</p>
                          <span>￥13.50</span>
                      </a></li>
                      <li><a href="">
                          <img src="./img/006.jpg" alt="">
                          <p>雷米高 路士 猫咪健康消毒液 250ml</p>
                          <span>￥49.00</span>
                      </a></li>
                      <li><a href="">
                        <img src="./img/007.jpg" alt="">
                        <p>小宠EHD 祛味消毒液 500ml祛味消毒液</p>
                        <span>￥35.00</span>
                    </a></li>
                    <li><a href="">
                        <img src="./img/008.jpg" alt="">
                        <p>爱丽思IRIS 加厚洁垫/尿片 AS-88 小号 88片装</p>
                        <span>￥36.00</span>
                    </a></li>
                  </ul>
             </div>
             
         </div>
         <div class="tubiao">
            <ul>
                <li><a href=""><img src="./img/1111.jpg" alt=""></a></li>
                <li><a href=""><img src="./img/2222.jpg" alt=""></a></li>
                <li><a href=""><img src="./img/3333.jpg" alt=""></a></li>
                <li><a href=""><img src="./img/4444.jpg" alt=""></a></li>
                <li><a href=""><img src="./img/5555.jpg" alt=""></a></li>
                <li><a href=""><img src="./img/6666.jpg" alt=""></a></li>
                <li><a href=""><img src="./img/7777.jpg" alt=""></a></li>
                <li><a href=""><img src="./img/8888.jpg" alt=""></a></li>
            </ul>
       </div>
         <div class="last">
             <div class="one">
            <ul>
                <li><a href="">正品保障</a></li>
                <li><a href="">品类丰富</a></li>
                <li><a href="">优质服务</a></li>
                <li><a href="">科学养宠</a></li>
                <li><a href="">益宠公益</a></li>
                <li><a href="">爱宠12年</a></li>
            </ul>
            </div>
            <div class="five">
            <img src="./img/last.png" alt="">
           </div>
            <div class="two">
               <ul>
                   <li><a href="">关于我们</a></li>
                   <li><a href="">E宠商城</a></li>
                   <li><a href="">E宠商城百家号</a></li>
                   <li><a href="">E宠说</a></li>
                   <li><a href="">E宠公益</a></li>
                   <li><a href="">联系我们</a></li>
                   <li><a href="">公司地址</a></li>
                   <li><a href="">应急响应</a></li>
                   <li><a href="">仓储中心</a></li>
                   <li><a href="">用户协议</a></li>
                   <li><a href="">易宠科技</a></li><br>
               </ul>
            </div>
            <div class="three">
                <ul>
                    <li><a href=""><img src="./img/x1.png" alt=""></a></li>
                    <li><a href=""><img src="./img/x2.png" alt=""></a></li>
                    <li><a href=""><img src="./img/x3.png" alt=""></a></li>
                    <li><a href=""><img src="./img/x4.png" alt=""></a></li>
                    <li><a href=""><img src="./img/x5.png" alt=""></a></li>
                    <li><a href=""><img src="./img/x6.png" alt=""></a></li>
                    <li><a href=""><img src="./img/x7.png" alt=""></a></li><br>
                </ul>
             </div>
             <div class="four">
                <ul>
                    <li><a href="">渝ICP备10002905号-1</a></li>
                    <li><a href="">渝ICP备10002905号-3</a></li>
                    <li><a href="">营业执照</a></li>
                    <li><a href="">兽药经营许可证</a></li>
                    <li><a href="">增值电信业务经营许可证</a></li>
                    <li><a href="">渝B2-20140042 Copyright</a></li>
                    <li><a href="">2007-2022 epet.com</a></li>
                    <li><a href="">重庆易宠科技有限公司</a></li>
                </ul>
             </div>
        </div>
    </div>
    <script src="./js/swiper-bundle.min.js"></script>
    <script src="./js/index.js"></script>
    <script src="./js/jquery.js"></script>
    <script src="./js/axios.min.js"></script>
    <script>
        var swiper = new Swiper(".mySwiper", {
          spaceBetween: 30,
          centeredSlides: true,
          autoplay: {
            delay: 2500,
            disableOnInteraction: false,
          },
          pagination: {
            el: ".swiper-pagination",
            clickable: true,
          },
          navigation: {
            nextEl: ".swiper-button-next",
            prevEl: ".swiper-button-prev",
          },
        });
      </script>
      <script>
          var btn = document.querySelector("#yi");
          window.onscroll = function(){
              if(document.documentElement.scrollTop >=700){
                  btn.style.display = "block";
              }else{
                  btn.style.display = "none";
              }
          };
          btn.onclick = function(){
              document.documentElement.scrollTop = 0;
          }


          

          $(document).ready(function(){
          $(".left li:eq(0)").mouseenter(function(){
          $(".nav1").show("slow")
           })
          $(".left").mouseleave(function(){
          $(".nav1").hide("slow")
          })
          })

          $(document).ready(function(){
          $(".left  li:eq(1)").mouseenter(function(){
          $(".nav2").show("slow")
           })
          $(".left").mouseleave(function(){
          $(".nav2").hide("slow")
          })
          })

          $(document).ready(function(){
          $(".left  li:eq(2)").mouseenter(function(){
          $(".nav3").show("slow")
           })
          $(".left").mouseleave(function(){
          $(".nav3").hide("slow")
          })
          })
          
          $(document).ready(function(){
          $(".left  li:eq(3)").mouseenter(function(){
          $(".nav4").show("slow")
           })
          $(".left").mouseleave(function(){
          $(".nav4").hide("slow")
          })
          })

          $(document).ready(function(){
          $(".left  li:eq(4)").mouseenter(function(){
          $(".nav5").show("slow")
           })
          $(".left").mouseleave(function(){
          $(".nav5").hide("slow")
          })
          })

      </script>
      <script>
        //商品列表接口
        pagesize = 8;
        pagenum = 0;

        let id = localStorage.getItem("id");console.log(id);
        let token = localStorage.getItem("token");
        loadLing();

        function loadLing(){
            let listAPI = "http://jx.xuzhixiang.top/ap/api/allproductlist.php";
            axios.get(listAPI,{params:{pagesize,pagenum,uid:87598}})
        .then((r)=>{
            console.log(r.data);
            let arr = r.data.data;
            let art = arr.map((v)=>
            `

                       <li>
                           <a href="detail.html?id=${v.pid}">
                            <img src="${v.pimg}" alt="">
                            <p>${v.pname}</p>
                            <span><b>￥</b>${v.pdesc}</span>
                            </a>
                        
                      </li>

            `
            ).join("");
            document.querySelector("#shop").innerHTML = art;
            
        })
    }
    

    </script>
</body>
</html>